/* CSS Document */
@import url(init.css);
@import url(boxin.css);
@import url(button.css);
@import url(register.css);
@import url(ruler.css);
@import url(pop.css);
@import url(treasure.css);

html,body {min-height:100%;}
body {position:relative;background:#2e3132;}

::-webkit-input-placeholder { /* WebKit browsers */ 
color: #762d0d; 
} 
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
color: #762d0d; 
} 
::-moz-placeholder { /* Mozilla Firefox 19+ */ 
color: #762d0d; 
} 
:-ms-input-placeholder { /* Internet Explorer 10+ */ 
color: #762d0d; 
} 

a {color:#F90;}

.bg01 {background:#f9db2f;}
.bg02 {background:#7f5b99;}
.roundcorner {background:#fef1af;border-radius:0.5rem;}
.inner {padding:1rem;}
.box {padding:2rem 1rem;}

.p01 {margin:1rem 0;font-size:1rem;}
.p02 {color:#fff;text-align:center;}
.p02 img {height:1.2rem;}
.p02 * {vertical-align:middle;}
.p03 {color:#000;text-align:center;}

.title img {width:100%;}

.heading01 {text-align:center;font-size:1.5rem;line-height:1;position:relative;}
.heading01 span {display:inline-block;background:#f9db2f;color:#3d1566;position:relative;padding:0 1rem;}
.heading01:before {content:"";width:100%;height:.07rem;background:#0a2e69;position:absolute;left:0;top:.7rem;z-index:0;}

.heading02 {text-align:center;font-size:1.5rem;line-height:1;}
.heading02 span {display:inline-block;color:#3d1566;padding:0 1rem;}

.heading03 {text-align:center;font-size:1.5rem;line-height:1;border-bottom:.062rem solid rgba(0,0,0,.4);padding:1rem 0 .5rem 0;}

.heading04 {text-align:center;font-size:1.5rem;line-height:1;padding:1rem 0 .5rem 0;}

.heading05 {text-align:center;font-size:1.5rem;line-height:1;padding:0 0 1rem 0;color:#f9db2f;font-weight:bold;}

.qrcode {width:30%;margin:1rem auto;text-align:center;background:#fff;border-radius:.1rem;overflow:hidden;}
.qrcode * {display:block;width:100%;}
.qrcode p {font-size:.8rem;line-height:1;padding-bottom:.5rem;}

.foot {text-align:center;}
.foot img {width:50%;}

.tail {background:#7f5b99 url(tail.svg) no-repeat 50% 100% / 100%;padding-bottom:5rem;border-top:.062rem solid #7f5b99;}

.tail01 {background:#f9db2f url(tail01.svg) no-repeat 50% 100% / 100%;padding-bottom:5rem;}

.store {padding:.25rem .5rem;text-align:center;padding-top: 0.4rem}
.store i {padding-left:1.5rem;background:url(icon_01.svg) no-repeat 0 50% / 1.2rem;font-size:1rem;}
.kin {padding:.25rem .5rem;text-align:center;padding-top: 0.4rem}
.kin i {padding-left:1.5rem;background:url(icon_02.svg) no-repeat 0 50% / 1.2rem;font-size:1rem;}

.box_in .store,
.box_in .kin {margin:0 .5rem;}

.yellowbtn {background:#f9db2f;color:#000;}

.list01 li {position:relative;border-bottom:.062rem solid #fce789;padding-left:2.8rem;}
.list01 li:last-child {border:0;}
.list01 em {
    display: block;
    position: absolute;
    left: .2rem;
    top: .2rem;
    height: 100%;
    width: 3.5rem;
    z-index: 999;
    line-height: 2rem;
}
.list01 em img {width:1.5rem;}
.list01 p {font-size:0;line-height:1;padding:.5rem 0;margin: 0}
.list01 span {display:inline-block;width:35%;vertical-align:middle;}
.list01 span:nth-child(1){display:inline-block;width:65%;vertical-align:middle;}
.list01 span:last-child {text-align:right;padding-right: 0.7rem}
.list01 span:last-child strong {padding-right:1rem;}
.list01 span b {font-size:1rem;display:block;font-weight:normal;max-width: 12rem;
    overflow: hidden;
    white-space: nowrap;
    margin-top: 0.2rem;
    text-overflow: ellipsis;
    padding-right: 0.1rem;
    color: #333333;
}
.list01 em i,
.list01 span i {
    font-size:.75rem;    color: #999;;vertical-align:middle;line-height:1.5;font-weight:normal;
    max-width: 10rem;
    overflow: hidden;
    white-space: nowrap;
    margin-top: 0.2rem;
    display: block;
    text-overflow: ellipsis;
}
.list01 .rankuserimg{
    width: 2rem;
    height: 2rem;
    border-radius: 100%;
    position: absolute;
    left: .5rem;
    top: .7rem;
}
.rankinfo1{
    padding: 0.5rem 0;color: #333;
}
.list01 em i {display:inline-block;margin-top:-.2rem;}
.list01 span strong {font-size:1.5rem;vertical-align:middle;margin-left:.2rem;}

.redenvelope img {width:90%}
.redenvelope .box_1in3 {text-align:center;}

.slogan {text-align:center;margin:1rem 0;font-size:1.05rem;}
.slogan * {display:inline-block;vertical-align:middle;}
.slogan img {height:1.5rem;}
.slogan .outstanding {background:#fff;border-radius:5rem;color:#ff333a;margin:0 .25rem;padding:0 .25rem;}

.btnbox01 {text-align:center;}
.btnbox01 a {display:inline-block;padding:.75rem 4rem;font-size:.9rem;}

.egg {margin-top:1rem;}
.egg img {width:100%;}

.storeincreasing i {display:block;font-size:1rem;color:#fff;text-align:center;}

.back {position:fixed;padding:.5rem;background:rgba(0,0,0,.8);border-radius:10rem;left:1rem;top:1rem;text-align:center;line-height:1;font-size:0;}
.back img {width:2rem;height:2rem;}

/*iP5*/
@media screen and (min-width:0) and (max-width:320px) {
.box {padding:1rem;}
.p01 {font-size:.9rem;}
}
/*iP6*/
@media screen and (min-width:321px) and (max-width:375px) {
}
/*6P*/
@media screen and (min-width:376px) and (max-width:414px) {
}


